<style lang=less>
	@import '../../assets/public.less';
	@import './ziChan.less';
</style>
<template lang="html">
	<div class="zi_chan_wrapper">
		<HeaDer></HeaDer>
		<div class="zi_chan_container">
			<el-header class="top">
				<el-card class="box-card">
					<div class="title">{{$t("ziChan.name")}}</div><!-- 资产 -->
				</el-card>
			</el-header>
			<el-card class="box-card zi_chan_content">
				<div class="right_title">
					<!--<span>账户总资产：{{ requestData.wallone }} USDT</span>-->
					<div class="title_link">
						<!--<router-link to="/moneyRecord">财务记录</router-link>-->
					</div>
				</div>
				<!-- 表格 -->
				<el-table :data="requestData" style="width: 100%">
					<el-table-column prop="pname" :label='$t("ziChan.list[0]")' width="180"><!-- 币种 -->
					</el-table-column>
					<el-table-column prop="usable" :label='$t("ziChan.list[1]")' width="180"><!-- 可用 -->
					</el-table-column>
					<el-table-column prop="frost" :label='$t("ziChan.list[2]")'><!-- 冻结 -->
					</el-table-column>
					<el-table-column :label='$t("ziChan.list[3]")'><!-- 操作 -->
						<template slot-scope="scope">
							  <!--3C  HAC HUB EA  CSC FSAC-->
							<span v-if="scope.row.pname == 'USDT' ||scope.row.pname == 'BTC' || scope.row.pname == 'ETH' || scope.row.pname == '3C' || scope.row.pname == 'HAC' || scope.row.pname == 'HUB' || scope.row.pname == 'EA'|| scope.row.pname == 'CSC'|| scope.row.pname == 'FSAC'" >
								<el-button @click="handleClick(scope.row,'/chongBit')" type="" plain size="small">{{$t("ziChan.canten[0]")}}</el-button><!-- 充值 -->
								<el-button @click="handleClick(scope.row,'/tiBit')" type="" plain size="small">{{$t("ziChan.canten[1]")}}</el-button><!-- 提币 -->
							</span>
							<span v-else>
								<el-button @click="handleClick(scope.row,'/chongBit')" type="" plain size="small" disabled>{{$t("ziChan.canten[0]")}}</el-button><!-- 充值 -->
								<el-button @click="handleClick(scope.row,'/tiBit')" type="" plain size="small" disabled>{{$t("ziChan.canten[1]")}}</el-button><!-- 提币 -->
							</span>
							
							
							<el-button @click="handleClick(scope.row,'/moneyRecord')" type="" plain size="small">{{$t("ziChan.canten[2]")}}</el-button><!-- 账单明细 -->
							
							<span v-if="scope.row.pname == '3C' || scope.row.pname == 'HAC' || scope.row.pname == 'HUB' || scope.row.pname == 'EA'|| scope.row.pname == 'CSC'|| scope.row.pname == 'FSAC'">
								<el-button @click="handleClick(scope.row,'/exchangeCoin')" type="" plain size="small">{{$t("ziChan.canten[4]")}}</el-button><!-- 兑换 -->
							</span>
							<span v-else>
								<el-button @click="handleClick(scope.row,'/exchangeCoin')" type="" plain size="small" disabled>{{$t("ziChan.canten[3]")}}</el-button><!-- 兑换 -->
							</span>
						</template>
					</el-table-column>
				</el-table>
				<div class="block button_pages" v-if="totalPage > 1">
					<i>{{$t("ziChan.page[0]")}} {{ pageNum }} {{$t("ziChan.page[1]")}}</i><!-- 第 {{ pageNum }} 页 -->
					<span @click="prevClick" v-if="prevBool">{{$t("ziChan.page[2]")}}</span><!-- 上一页 -->
					<span @click="nextClick" v-if="nextBool">{{$t("ziChan.page[3]")}}</span><!-- 下一页 -->
				</div>
			</el-card>
		</div>
		<FooTer></FooTer>
	</div>
</template>
<script>
	/**
	 *问题
	 *1、点击交易跳转到 杠杆交易  -> 杠杆交易
	 * 
	 */
	// import Header from "../main/header.vue";
	// import Footer from "../main/footer.vue";
	export default {
		data() {
			return {
				requestData: [], // 资产列表数据
				prevBool: false,
				nextBool: true,
				pageNum: 1, // 当前页数
				totalPage: null, // 总页数
				// totalNumber: null, // 总条数
			}
		},
		methods: {
			// 上一页、下一页
			prevClick: function(page) {
				var _this = this;
				_this.pageNum--;

				if(_this.pageNum <= 1) {
					_this.prevBool = false;
					_this.nextBool = true;
					_this.requestPublic();
					return;
				} else {
					_this.nextBool = true;
					_this.requestPublic();
				}
			},
			nextClick: function(page) {
				var _this = this;
				_this.pageNum++;
				if(_this.pageNum >= _this.totalPage) {
					_this.requestPublic();
					_this.prevBool = true;
					_this.nextBool = false;
				} else {
					_this.prevBool = true;
					_this.requestPublic();
				}
			},
			// 点击交易事件
			handleClick: function(row,url) {
				// 本行信息
				var _this = this;
				

				if(url == '/moneyRecord'){
					//交易记录
					_this.$router.push({ path: url, query:{pid:row.pid}});
				}else{
					_this.$router.push({ path: url, query:{pid:row.pid,pname:row.pname,mark:row.mark,usable:row.usable,frost:row.frost}});					
//					if(row.pname  == 'USDT' || (row.pname == "BTC")){						
//						_this.$router.push({ path: url, query:{pid:row.pid,pname:row.pname}});
//					}else{
//						_this.$public.msg('稍后开放', 'warning', _this);
//					}
				}
//				console.log(row.pname);
				
			},
			// 资产列表数据请求
			requestPublic: function() {
				var _this = this;
				_this.$http.get(_this.$http.ziChan, {params: {p: _this.pageNum}})
					.then((res) => {
//						console.log(res.data.data.asset)
						_this.requestData = res.data.data;
//						 _this.totalNumber = res.data.data.count;
//						_this.totalPage = Math.ceil(res.data.data.count / res.data.data.size);
						// if(_this.totalNumber<=1){
						// 	_this.nextBool = false;
						// }
					});
			}
		},
		created: function() {
			var _this = this;
			window.scrollTo(0, 0); //回到顶部
			_this.requestPublic();
		},
		// components: {
		// 	"HeaDer": Header,
		// 	"FooTer": Footer,
		// }
	}
</script>